{extend name="base" /}
{block name="css"}
<link rel="stylesheet" media="screen" href="{__CSS__}/css/login.css?v={:rand_number()}"/>
{/block}
{block name="body"}
{include file="common/header" /}
<div class="login-wrapper" style="margin-top: 30px;"> 


    <form id="login_form" class="layui-form" action="{:url('user/authenticationcheck')}" method="post">
       <h1 style="text-align:center;">{:__('identity authentication')}</h1>
        <div class="layui-form-item layui-input-icon-group">
                </div>
         <div class="layui-form-item layui-input-icon-group">
            <i class="layui-icon layui-icon-email"></i>
            <input class="layui-input" name="email" id="email" value="<?php echo base64_decode($_GET['email']);?>" placeholder="{:__('mailbox')}" autocomplete="off"
                   lay-verType="tips" lay-verify="required" required readonly="readonly"/>
        </div>
        
                <div class="layui-form-item layui-input-icon-group login-captcha-group">
            <i class="layui-icon layui-icon-auz"></i>
            <input class="layui-input" id="code" name="code" placeholder="{:__('Please enter the verification code')}" autocomplete="off"/>
            <botton lay-filter="retrievemima" id="emaila" lay-submit class="login-captcha" />点击发送</botton>
        </div>
        
                <div class="layui-form-item layui-input-icon-group login-captcha-group">
            <i class="layui-icon layui-icon-auz"></i>
            <input class="layui-input" name="captcha" id="captcha" placeholder="{:__('Please enter the verification code')}" autocomplete="off" />
            <img src="{:captcha_src()}" onclick="this.src='{:captcha_src()}?rand='+Math.random()" class="login-captcha" />
        </div>
                <div class="layui-form-item">
            <input type="checkbox" name="keeplogin" id="keeplogin" value="1" title="{:__('Remember')}" lay-skin="primary" checked>
        </div>
        <div class="layui-form-item">
              
              <input type="submit" class="layui-input" style="cursor:pointer" id='btnsave' lay-filter="save" lay-submit disabled="disabled" value="{:__('Submit for verification')}">
        </div>
    </form>
</div>  

<style>
.notClick{
height:40px; pointer-events: none
 } 
</style>
</body>

{/block}
{block name="js"}
{include file="common/footer" /}

  <script type="text/javascript">

 
     
    layui.use(['layer', 'form', 'jquery'], function(){
        var layer = layui.layer,
            form  = layui.form,
            $     = layui.jquery;
form.on('submit(retrievemima)', function (data) {
                //清空input
                $("input[name='code']").val("").focus();
                $("input[name='password']").val("").focus();
   var index = layer.msg('<i>{:__('Sending, please wait')}</i>', {
        icon: 16,
        time: false,
        shade: 0.3,
        anim: 1
    });
    $.ajax({
         url: "{:url('user/authentication')}",
        type: data.form.method,
        dataType: 'json',
        data: $(data.form).serialize(),
        success: function (result) {
            if (result.code === 0) {
            //$('input[name="code"]').val(result.captcha);
                setTimeout(function () {
                     if(isNaN(parseInt($("#emaila").html()))){
                        var origText  = '60';
                        var interval = setInterval(function(){
                            var time = --origText;
                            if(time <= 0) {
                                clearInterval(interval);
                                $('#emaila').html('{:__('Resend')}').css('border','none').css('color','#ffffff').css('background','#009688').removeClass("notClick");
                            }else{
                                $('#emaila').html(time+'&nbsp;&nbsp;{:__('second')}').css('border','1px solid #f2f2f2').css('color','#616161').css('background','buttonface').addClass('notClick');
                            
                        }
                        }, 1000);
                   // parent.location.reload();
                   }
                }, 1000);

            layer.close(index);
            layer.msg(result.msg, {icon: 1});
            }else{
                
            layer.close(index);
            layer.msg(result.msg, {icon: 2});
            }
        },
    });
    return false;
});
form.on('submit(save)', function (data) {
    var index = layer.msg('<i>{:__('Verification in progress, please wait')}</i>', {
        icon: 16,
        time: false,
        shade: 0.3,
        anim: 4
    });
    $.ajax({
        url: data.form.action,
        type: data.form.method,
        dataType: 'json',
        data: $(data.form).serialize(),
        success: function (result) {
            if (result.code === 0) {
                setTimeout(function () {
                        location.href = result.url;
                    //parent.location.reload();
                }, 1000);
           
            layer.close(index);
            layer.msg(result.msg, {icon: 1});
            }else{
                
            layer.close(index);
            layer.msg(result.msg, {icon: 2});
            }
        },
    });
    return false;
    
});

  $("input").on("input",function(){
             var getCode = $("#code").val();
             var getCaptcha = $("#captcha").val();
             var getKeeplogin = $("#Keeplogin").val();
             var getEmail = $("#email").val();
 
             $(this).css("color","#232323");
 
             if(getCode != '' && getCaptcha != '' && getKeeplogin != '' && getEmail != ''){
            
             $('#btnsave').attr('disabled', false).css('background','#009688').css('border','none').css('color','#fff') 
               }
             else{ 
             $('#btnsave').attr('disabled', true).css('background','rgba(0,0,0,20%)').css('border','1px solid #fff').css('color','#232323'); 
    
           }
       });
});

</script>
{/block}